<template>
    <div class="content">
        <div class="page-search">
            <mt-search class='search_box' autofocus v-model="value" @keyup.native="search(value)">
            </mt-search>
        </div>
        <ul class='list' v-show='isShow'  infinite-scroll-disabled="loading" infinite-scroll-distance="10">
             <li v-for="item in storyList" class='list-item'>
                <img :src="item.book_cover" class='img-item'>
                <div class="con">
                    <div class="name">{{item.bookname}}</div>
                    <div class="author">{{item.author_name}}</div>
                    <div class="content">{{item.book_info}}</div>
                </div>
            </li>
        </ul>
        <ul class='list-search' v-show='searchRec'>
            <li v-for="item in itemList" class='list-item'>
               {{item}}
            </li>
        </ul>  
        <ul class='list-search' v-show='true'>
            <li v-for="item in mockList" class='list-item'>
               {{item.name}}
            </li>
        </ul> 
        <div v-show="tip">sorry,暂时没有您查找的书!</div>         
    </div>
</template>

<script>
    import { mapState, mapGetters, mapMutations, mapActions } from 'vuex';
    
    export default {
        computed: {
            ...mapState(['itemList']),
            ...mapGetters([
                 // 'storyList', 
                  'isShow', 
                  'tip',
                  'searchRec',
                  'itemList',
                  'mock'
            ]),
            
        },
        methods: {
            ...mapMutations([
                'Info',
                'hh'
            ]),
            ...mapActions([               
                 'getList',
                 'add',
                 'getHd',
                 'search',
                 'getMock'
                
            ])
            
        },
        data() {
            return {
                storyList: []
              
            }
        },
        mounted(state){
            this.getList().then(data=>{
                //const _reData = data.data.data;
               // this.storyList = _reData;          
            });
            console.log(this.getMock())
            this.getMock().then(data=>{
                this.mockList = data.array;
                console.log('mock------',data)
                     
            });
            this.getHd().then(data=>{
                console.log('haiodng',data)        
            });
        }
    }
</script>

<style scoped lang='less'>
    @import "./paragraph.less";
</style>